<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="referrer" content="never" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>中兴商城</title>
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./css/list.css" />
    <link rel="stylesheet" href="./../static/list/css/jquery.jqzoom.css" />
  </head>
  <body>
    @@include('./template/index-header.html')
    <!-- 放大镜 -->
    <div class="tion"></div>
    <div class="main" id="list">
      <div class="main-left">
        <div class="jqzoom">
          <a href="#" class="jqzoom" title="" id="smil" rel="gal1">
            <!-- src.split(',')[0] + ',w_310,h_310'; -->
            <img class="img" src="#" style="width: 310px" />
          </a>
        </div>
        <ul class="goods" id="thumblist">
          <li>
              <a class="zoomThumbActive" href='javascript:void(0);'
                 rel="{gallery: 'gal1', smallimage: '//image.ztemall.com/1af1bda96d100718e54e263de09b1084.png?x-oss-process=image/resize,w_750,h_750',largeimage:'//image.ztemall.com/1af1bda96d100718e54e263de09b1084.png?x-oss-process=image/resize,w_750,h_750'}">
                  <img src='//image.ztemall.com/1af1bda96d100718e54e263de09b1084.png?x-oss-process=image/resize,w_750,h_750'>
              </a>
          </li>
          <li>
              <a class="zoomThumbActive" href='javascript:void(0);'
                 rel="{gallery: 'gal1', smallimage: '//image.ztemall.com/06c50220d2a87349bf3f5c98372ef0a4.jpg?x-oss-process=image/resize,w_750,h_750',largeimage: '//image.ztemall.com/06c50220d2a87349bf3f5c98372ef0a4.jpg?x-oss-process=image/resize,w_750,h_750'}">
                  <img src='//image.ztemall.com/06c50220d2a87349bf3f5c98372ef0a4.jpg?x-oss-process=image/resize,w_750,h_750'>
              </a>
          </li>
          <li>
              <a class="zoomThumbActive" href='javascript:void(0);'
                 rel="{gallery: 'gal1', smallimage: '//image.ztemall.com/f9f68706c54f1485e9f97fc825ffe4dd.png?x-oss-process=image/resize,w_750,h_750',largeimage: '//image.ztemall.com/f9f68706c54f1485e9f97fc825ffe4dd.png?x-oss-process=image/resize,w_750,h_750'}">
                  <img src='//image.ztemall.com/f9f68706c54f1485e9f97fc825ffe4dd.png?x-oss-process=image/resize,w_750,h_750'>
              </a>
          </li>
          <li>
              <a class="zoomThumbActive" href='javascript:void(0);'
                 rel="{gallery: 'gal1', smallimage: '//image.ztemall.com/ef294bd5c07b4d2077d3593646ebc18c.png?x-oss-process=image/resize,w_750,h_750',largeimage: '//image.ztemall.com/ef294bd5c07b4d2077d3593646ebc18c.png?x-oss-process=image/resize,w_750,h_750'}">
                  <img src='//image.ztemall.com/ef294bd5c07b4d2077d3593646ebc18c.png?x-oss-process=image/resize,w_750,h_750'>
              </a>
          </li>
        
<!--                <span id="l"><</span>-->
<!--                <span id="r">></span>-->
      </ul>
      </div>
      <div class="main-right">
        <span class="p1"><p>中兴Axon 30 5G 屏下摄像手机</p></span>
        <span class="p2"
          ><p>
            全新一代屏下摄像手机，骁龙870，三重护眼认证，120Hz屏幕高刷
            【12+256G版本 限时直降100元】
          </p></span
        >
        <div class="d1">
          <p><span class="p3">￥2198.00</span><del>￥2198.00</del></p>
          <p>
            <span class="p6">优惠信息</span> <span class="p4">赠品</span>

            <img
              src="//image.ztemall.com/4e5a9e9dda0c1c1f8fc7dcd47ce0da91.jpg"
              alt=""
            />
            <span class="p5">✖ 1 &emsp;(购满1件即赠，赠完为止)</span>
          </p>
        </div>
        <div class="qiantou">
          颜色&emsp;&emsp;<span
            ><img
              src="https://image.ztemall.com/b941f35b6181427b120325bef7a9073a.jpg?x-oss-process=image/resize,w_750,h_750"
              alt=""
          /></span>
        </div>
        <div class="qiantou">
          版本&emsp;&emsp;<span>8GB+128G</span><span>8GB+256G</span>
        </div>
        <div class="qiantou">套餐类型<span>官方标配</span></div>
        <div class="shuliang">
          数&emsp;量 &emsp;&emsp;
          <p>-</p>
          <input type="text" value="1" />
          <p>+</p>
        </div>
        <div class="butn">
          <button class="btn1 goumai">立即购买</button>
          <button class="btn2 gouwuche">加入购物车</button>
        </div>
      </div>
    </div>
    <!-- 详情页 -->
    <div class="main-nav">
      <p class="imges">
        <br />
        <img
          src="https://image.ztemall.com/3a43167691a3a2a37ecf4c31418a297a.jpg"
        />
        <img
          src="https://image.ztemall.com/776eaf6289a74cfaddf2345d502a4040.jpg"
        />
        <img
          src="https://image.ztemall.com/7e3354c2384acf83d14c39cc9f67a34d.jpg"
        />
        <img
          src="https://image.ztemall.com/41ed97a0ce94f71b5f72553d5794aa90.jpg"
        />
        <img
          src="https://image.ztemall.com/9fa0a8b85ce2ea5a5cfd0030d32882c6.jpg"
        />
        <img
          src="https://image.ztemall.com/10d6a6bf4dc096bcc22901cfcb24c880.jpg"
        />
        <img
          src="https://image.ztemall.com/b28f9a49bf19a88265b5bd410a196da6.jpg"
        />
        <img
          src="https://image.ztemall.com/b02d71e8e558f0ed4ebcf7190a0e6222.jpg"
        />
        <img
          src="https://image.ztemall.com/f627f88d7ebe46834375c1d379e6a3c6.jpg"
        />
        <img
          src="https://image.ztemall.com/cc4ea5d94619c01bcb783be88048fdee.jpg"
        />
        <img
          src="https://image.ztemall.com/025eb692a97eec248a3c3e79e011c7b4.jpg"
        />
        <img
          src="https://image.ztemall.com/fb5a31b2dfcb23d13f42256c7053ac84.jpg"
        />
        <img
          src="https://image.ztemall.com/bd5462c4c1db655c92e7bde286c7e1f6.jpg"
        />
        <img
          src="https://image.ztemall.com/6e70d9f07848b9f42378b4680f86e489.jpg"
        />
        <img
          src="https://image.ztemall.com/ff2c9aa6008eb69d2bd589ed9a4b95b7.jpg"
        />
        <img
          src="https://image.ztemall.com/2e851830c44861242f0c0bcc57749c83.jpg"
        />
        <img
          src="https://image.ztemall.com/c9b0cd11f0fb7d4ff0feaef11031163a.jpg"
        />
        <img
          src="https://image.ztemall.com/59a577d66149a7dd556a6ba1ab60783f.jpg"
        />
        <img
          src="https://image.ztemall.com/52b51446817f834535dd1c201c358a6c.jpg"
        />
        <img
          src="https://image.ztemall.com/2fc0a33b79f6377e55132e82da385492.jpg"
        />
        <img
          src="https://image.ztemall.com/0d775149dbc28ecc498e9c62c3c36548.jpg"
        />
        <img
          src="https://image.ztemall.com/1011e345912b886498613effb4e0692e.jpg"
        />
        <img
          src="https://image.ztemall.com/8d4ded49c2c74176b7a63809ab093bb7.jpg"
        />
        <img
          src="https://image.ztemall.com/8e193d1a26391a1d793fc14b9aed970e.jpg"
        />
        <img
          src="https://image.ztemall.com/98d97e68c00960c0b602c07db18818d6.jpg"
        />
        <img
          src="https://image.ztemall.com/bb0739b3c0cfd6d232717f7f2f6ea36f.jpg"
        />
        <img
          src="https://image.ztemall.com/5947de142ba67a8b28830d51e9898ef0.jpg"
        />
        <img
          src="https://image.ztemall.com/e9cabd5cb382a7bd517bbdcc6bce87a2.jpg"
        />
      </p>
    </div>
    <div class="middle-main">
      <div class="interior">@@include('./template/index-footer.html')</div>
    </div>
    <script src="../static/javascripts/utils.js"></script>
    <script src="../static/javascripts/jQuery.js"></script>
    <script src="../static/javascripts/axios.js"></script>
    <script src="./../static/list/js/jquery-1.5.js"></script>
    <script src="./../static/list/js/jquery.jqzoom-core.js"></script>
    
    <script src="./javascripts/suju.js"></script>
    <script src="./javascripts/list.js"></script>
    <script>
      $jq(function () {
        $jq(".jqzoom").jqzoom({
          //（默认值）standard / reverse,原图用半透明图层遮盖
          zoomType: "standard",
          //是否在原图上显示镜头
          lens: true,
          // 预先加载大图片
          preloadImages: true,
          //放大镜是否总是显示存在
          alwaysOn: false,
          //放大窗口的尺寸
          zoomWidth: 410,
          zoomHeight: 410,
          //放大窗口相对于原图的偏移量、位置
          xOffset: 0,
          yOffset: 0,
          position: "left",
          //默认值：true，是否显示加载提示Loading zoom
          showPreload: false,
          //默认 Loading zoom，自定义加载提示文本
          preloadText: "加载中……",
          //imageOpacity 默认值 0.2 透明度
          //title 是否在放大窗口中显示标题，值可以为a标记的title值，若无，则为原图的title值
        });
      });
    </script>
  </body>
</html>
